<!--
 * @Date: 2024-12-23 10:38:30
 * @LastEditors: Lcx l1556461835@163.com
 * @LastEditTime: 2025-03-21 08:54:18
 * @FilePath: \simulation-fontend\pages\simulationList\index.vue
 * @Description: 仿真任务列表
-->

<template>
  <el-card>
    <hmi-table 
    :table-data="tableData" 
    :table-head="true"
    :is-pagination-show="true"
    :table-height="'calc(100vh - 220px)'"
    :total="total"
    :current-page="pageIndex"
    :page-size="pageSize"
    index-type="index"
    @handle-current-change="handleCurrentChange"
    @handle-size-change="handleSizeChange">
      <template slot="TableHead">
        <el-form ref="simListRef" :inline="true" :model="searchInfo">
          <el-form-item label="任务名称" prop="name">
            <el-input v-model="searchInfo.name" placeholder="任务名称"></el-input>
          </el-form-item>
          <el-form-item label="提交时间">
            <el-date-picker
              v-model="searchInfo.startTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
              placeholder="开始时间">
            </el-date-picker>
            <span>-</span>
            <el-date-picker
              v-model="searchInfo.endTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
              placeholder="结束时间">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="提交人" prop="subPerson">
            <el-input v-model="searchInfo.subPerson" placeholder="任务名称"></el-input>
          </el-form-item>
          <el-form-item label="钢种" prop="steelGrade">
            <el-input v-model="searchInfo.steelGrade" placeholder="钢种"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" size="small" @click="handleSearch">查询</el-button>
            <el-button type="info" size="small" @click="handleReset">重置</el-button>
          </el-form-item>
          <el-form-item label="仿真类型" prop="calcType">
            <el-radio-group v-model="searchInfo.calcType">
              <el-radio :label="6">加热炉仿真</el-radio>
              <el-radio :label="1">粗轧仿真</el-radio>
              <el-radio :label="3">精轧仿真</el-radio>
              <el-radio :label="4">层冷仿真</el-radio>
              <!-- <el-radio :label="7">性能预测</el-radio> -->
            </el-radio-group>
          </el-form-item>
        </el-form>
      </template>
      <template slot="TableBody">
        <el-table-column label="任务名称" prop="name" align="center"></el-table-column>
        <el-table-column label="钢种" prop="steelGrade" align="center"></el-table-column>
        <el-table-column label="仿真类型" prop="calctypeText" align="center"></el-table-column>
        <el-table-column label="任务状态" prop="status" align="center"></el-table-column>
        <el-table-column label="提交人" prop="subPerson" align="center"></el-table-column>
        <el-table-column label="时间" prop="createTime" align="center"></el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scoped">
            <div>
              <el-button type="text" size="small" @click="handleSee(scoped.row)">查看</el-button>
              <el-button type="text" size="small" @click="handleEdit(scoped.row)">引用</el-button>
              <el-popconfirm
                confirm-button-text='确定'
                cancel-button-text='取消'
                icon="el-icon-info"
                icon-color="red"
                title="确定删除此数据吗？"
                @confirm="handleDel(scoped.row)"
              >
                <el-button slot="reference" type="text" size="small"><span style="color: #F56C6C">删除</span></el-button>
              </el-popconfirm>
            </div>
          </template>
        </el-table-column>
      </template>
    </hmi-table>

    <!-- 查看/引用 -->
    <el-dialog
      :visible.sync="dialogVisable"
      :before-close="handleClose"
      :close-on-click-modal="false"
      :title="dialogTitle"
      width="80%">
      <component v-if="dialogVisable" :is="tab" :form-info="seeObj" :flag="flag" class="simBox" @close="handleClose"></component>
    </el-dialog>
  </el-card>
</template>

<script>
import FmSim from "../components/FmSim.vue"; // 精轧
import RmSim from "../components/RmSim.vue";
import FceSim from "../components/FceSim.vue";
import LCS from "../components/LCS.vue";
import prediction from "../components/prediction.vue";
import HmiTable from "@/components/HmiTable";
import { post } from "@/lib/Util";
export default {
  components: { HmiTable, FmSim, RmSim, FceSim, LCS, prediction },
  data() {
    return {
      tableData: [],
      searchInfo: {
        calcType: null,
        createTime: "",
        name: "",
        subPerson: "",
        startTime: "",
        endTime: "",
        steelGrade: ""
      },
      pageIndex: 1,
      pageSize: 20,
      total: 0,
      dialogVisable: false,
      dialogTitle: "查看",
      calctypeObj: {
        6: {
          label: "加热炉仿真",
          component: "FceSim"
        },
        1: {
          label: "粗轧仿真",
          component: "RmSim"
        },
        3: {
          label: "精轧仿真",
          component: "FmSim"
        },
        4: {
          label: "层冷仿真",
          component: "LCS"
        }
        // 7: {
        //   label: "性能预测",
        //   component: "prediction"
        // }
      },
      tab: null,
      seeObj: {},
      flag: 0
    };
  },
  mounted() {
    this.getData();
  },
  methods: {
    handleSearch() {
      this.pageIndex = 1;
      this.getData();
    },
    handleReset() {
      this.$refs.simListRef.resetFields();
      this.pageIndex = 1;
      this.getData();
    },
    async getData() {
      let res = await post(
        `/api/tbProcalcSum/getAll?current=${this.pageIndex}&size=${
          this.pageSize
        }`,
        this.searchInfo
      );
      this.tableData = res.data.list;
      this.total = res.data.total;
    },
    handleDel(row) {
      if (row.matId) {
        post(`/api/tbProcalcSum/byMatIdDelete?matId=${row.matId}`).then(res => {
          this.$message({
            message: res.message,
            type: "success"
          });
          this.getData();
        });
      } else {
        this.$message({
          message: "选择的数据有误，请刷新后操作",
          type: "warning"
        });
      }
    },
    handleCurrentChange(val) {
      this.pageIndex = val;
      this.getData();
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.getData();
    },
    // 弹窗内容
    handleClose() {
      this.dialogVisable = false;
      this.getData();
    },
    async handleSee(row) {
      this.dialogTitle = this.calctypeObj[row.calctype].label + "查看";
      let res = {};
      if (row.calctype == 6) {
        res = await post(
          `/api/tbProcalcSum/heatingFurnaceShow?calctype=${
            row.calctype
          }&matId=${row.matId}`
        );
      } else if (row.calctype == 1) {
        res = await post(
          `/api/tbProcalcSum/roughingShow?calctype=${row.calctype}&matId=${
            row.matId
          }`
        );
      } else if (row.calctype == 3) {
        res = await post(
          `/api/tbProcalcSum/finishRollingShow?calctype=${row.calctype}&matId=${
            row.matId
          }`
        );
      } else if (row.calctype == 4) {
        res = await post(
          `/api/tbProcalcSum/layerCoolingShow?calctype=${row.calctype}&matId=${
            row.matId
          }`
        );
      } else if (row.calctype == 7) {
        res = await post(
          `/api/tbProcalcSum/redictionGet?calctype=${row.calctype}&matId=${
            row.matId
          }`
        );
      }
      if (res.code == 200) {
        this.tab = this.calctypeObj[row.calctype].component;
        this.flag = 1;
        this.dialogVisable = true;
        this.seeObj = res.data;
      }
    },
    // 引用
    async handleEdit(row) {
      this.dialogTitle = this.calctypeObj[row.calctype].label + "引用";
      let res = {};
      if (row.calctype == 6) {
        res = await post(
          `/api/tbProcalcSum/heatingFurnaceShow?calctype=${
            row.calctype
          }&matId=${row.matId}`
        );
      } else if (row.calctype == 1) {
        res = await post(
          `/api/tbProcalcSum/roughingShow?calctype=${row.calctype}&matId=${
            row.matId
          }`
        );
      } else if (row.calctype == 3) {
        res = await post(
          `/api/tbProcalcSum/finishRollingShow?calctype=${row.calctype}&matId=${
            row.matId
          }`
        );
      } else if (row.calctype == 4) {
        res = await post(
          `/api/tbProcalcSum/layerCoolingShow?calctype=${row.calctype}&matId=${
            row.matId
          }`
        );
      } else if (row.calctype == 7) {
        res = await post(
          `/api/tbProcalcSum/redictionGet?calctype=${row.calctype}&matId=${
            row.matId
          }`
        );
      }
      if (res.code == 200) {
        this.tab = this.calctypeObj[row.calctype].component;
        this.flag = 2;
        this.dialogVisable = true;
        this.seeObj = res.data;
      }
    }
  }
};
</script>

<style>
.simBox {
  height: calc(100vh - 140px);
  overflow-y: scroll;
}
</style>
